function createRequest() {
    if (window.XMLHttpRequest) {
        return new XMLHttpRequest();
    } else {
        return new ActiveXObject('Microsoft.XMLHTTP');
    }
}
var ip = 'http://192.168.10.102:8888/';
window.onload = function () {
    var list = document.getElementById('userName');
    var user = localStorage.getItem('user')
    var username = JSON.parse(user);
    if (username !== null) {
        var li = document.createElement('li');
        var a = document.createElement('a');
        a.innerHTML = 'welcome' + username.data.username;
        li.appendChild(a);
        list.appendChild(li);
    }
    var xhr = createRequest();
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4) {
            if (xhr.status === 200) {
                var allPicture = JSON.parse(xhr.responseText);
                console.log(allPicture[0].img)
                var picture = document.getElementById('picture');
                // picture.src = 'http://192.168.0.254:3000/' + allPicture[0].img;
                // console.log(xhr.responseText);
                var point = document.getElementsByClassName('point');
                var a = point[0].children;
                var timer;
                var index = 0;
                function backg() {
                    for (var i = 0; i < a.length; i++) {
                        a[i].style.backgroundColor = '#999999';
                    }
                }
                timer = setInterval(function () {
                    index %= allPicture.length;
                    picture.src = ip + allPicture[index].img
                    backg();
                    a[index].style.backgroundColor = '#FFFFFF'
                    index++;
                }, 1000)
                for (var j = 0; j < a.length; j++) {
                    a[j].num = j;
                    a[j].onmouseover = function () {
                        clearInterval(timer);
                        picture.src = ip + allPicture[this.num].img
                        backg();
                        a[this.num].style.backgroundColor = '#FFFFFF'
                    }
                    a[j].onmouseout = function () {
                        timer = setInterval(function () {
                            index %= allPicture.length;
                            picture.src = ip + allPicture[index].img
                            backg();
                            a[index].style.backgroundColor = '#FFFFFF'
                            index++;
                        }, 1000);
                    }
                }
            }
        }
    }
    xhr.open('get', 'http://192.168.10.102:8888/showImages')
    xhr.send();
}
// 以上轮播图
var arrr = [];
function left() {
    var xhr = createRequest();
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4) {
            if (xhr.status === 200) {
                var books1 = JSON.parse(xhr.responseText);
                books1.map(function (item) {
                    var asid = document.getElementsByTagName('aside');
                    var div = document.createElement('div');
                    div.className = 'leftBook';
                    var a = document.createElement('a');
                    var h2 = document.createElement('h2');
                    h2.className = 'leftPrice';
                    var p = document.createElement('p');
                    p.className = 'leftIntroduce';
                    div.appendChild(a);
                    div.appendChild(h2);
                    div.appendChild(p);
                    asid[0].appendChild(div);
                    p.innerHTML = item.name;
                    h2.innerHTML = '¥' + item.price;
                    console.log(item);
                    a.innerHTML = '<img src="' + ip + item.img + '" onclick="go(\'' + item.skuId + '\',\'' + item.img + '\',\'' + item.name + '\',\'' + item.price + '\')">';
                })
            }
        }
    }
    xhr.open('get', 'http://192.168.10.102:8888/showADBooks')
    xhr.send();
}
left();
function center() {
    var xhr = createRequest();
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4) {
            if (xhr.status === 200) {
                var book2 = JSON.parse(xhr.responseText);
                book2.map(function (item) {
                    var cen = document.getElementById('cen');
                    //    var img2 = document.createElement('img');
                    var div0 = document.createElement('div');
                    var div2 = document.createElement('div');
                    var a2 = document.createElement('a');
                    var a3 = document.createElement('a');
                    var h4 = document.createElement('h4');
                    var p = document.createElement('p');
                    var span1 = document.createElement('span');
                    var span2 = document.createElement('span');
                    var span3 = document.createElement('span');
                    div0.className = 'center3';
                    div0.appendChild(a2);
                    div0.appendChild(h4);
                    div0.appendChild(p);
                    div0.appendChild(div2);
                    div2.appendChild(span1);
                    div2.appendChild(span2);
                    div2.appendChild(span3);
                    div0.appendChild(a3);
                    div2.className = 'active';
                    span1.className = 'zi';
                    span2.className = 'fang';
                    span3.className = 'miao'
                    cen.appendChild(div0);
                    a2.innerHTML = '<img src="' + ip + item.img + '" onclick="information(\'' + item.skuId + '\',\'' + item.img + '\',\'' + item.name + '\',\'' + item.price + '\')">';
                    a3.innerHTML = '<button onclick="goCart(\'' + item.skuId + '\',\'' + item.img + '\',\'' + item.name + '\',\'' + item.price + '\')"><i class="fa fa-shopping-cart" aria-hidden="true"></i>加入购物车</button>'
                    // img2.src =  'http://192.168.0.254:3000/' + item.img;
                    h4.innerHTML = '¥' + item.price;
                    p.innerHTML = item.name;
                    span1.innerHTML = '自营';
                    span2.innerHTML = '放心购';
                    span3.innerHTML = '秒杀';
                })

            }
        }
    }
    xhr.open('get', 'http://192.168.10.102:8888/getBooks')
    xhr.send();
}
center();
// 以下是加入购物车以及进入详情页面;
function go(id,img,na,pr) {
    var bookin = {
        book_id:id,
        book_img:img,
        book_name:na,
        book_price:pr,
        book_number:1
    };
    localStorage.setItem('bookIformation', JSON.stringify(bookin));
    console.log(bookin);
    window.location = "http://127.0.0.1:5500/html/book.html";
}
function information(id,img,na,pr) {
    var bookin = {
        book_id:id,
        book_img:img,
        book_name:na,
        book_price:pr,
        book_number:1
    };
    localStorage.setItem('bookIformation', JSON.stringify(bookin));
    console.log(bookin);
    window.location = "http://127.0.0.1:5500/html/book.html";
}
var allBooksArray = [];
function goCart(id,img,name,price) {
    var cartBook = {
        book__id: id,
        book__img: img,
        book__name: name,
        book__price: price,
        book__number: 1
    }
    var user = localStorage.getItem('user')
    var username = JSON.parse(user);
    if (username != null) {
        var allBooks_json = localStorage.getItem('allBooks');
        console.log(allBooks_json);
        if (allBooks_json != null) {
            allBooksArray = JSON.parse(allBooks_json);
        }
        var cartNumber = true;
        for (var i = 0; i < allBooksArray.length; i++) {
            if (allBooksArray[i].book__id === id) {
                allBooksArray[i].book__number++;
                cartNumber = false;
                break;
            }
        }
        if (cartNumber) {
            allBooksArray.push(cartBook);
        }

        localStorage.setItem('allBooks', JSON.stringify(allBooksArray));

    } else {
        alert('请登录后再操作');
        window.location = "http://127.0.0.1:5500/html/login.html";

    }
}